{% extends 'base.html' %}
{% block title %}银行卡管理{% endblock %}

{% block content %}
<div style="max-width: 1200px; margin: 20px auto; padding: 0 20px;">
  <div class="d-flex align-items-center mb-4" style="font-size: 20px; font-weight: bold; color: #333;">
    <i class="bi bi-credit-card" style="font-size: 26px; color: #3f51b5; margin-right: 10px;"></i>
    银行卡管理
  </div>


 <!-- 查询卡片 -->
<div class="card mb-4 p-4">
  <div class="d-flex align-items-center mb-3" style="font-size: 20px; font-weight: bold; color: #333;">
    <i class="bi bi-search" style="font-size: 24px; color: #3f51b5; margin-right: 10px;"></i>
    🔍查询银行卡
  </div>

  {% if error %}
    <div class="alert alert-warning">{{ error }}</div>
  {% endif %}

  <form method="GET" action="{{ url_for('cards') }}" class="row gy-2 gx-3 align-items-end">
    <div class="col-sm-3">
      <label class="form-label">查询模式</label>
      <select name="mode" class="form-select">
        <option value="">-- 请选择 --</option>
        <option value="exact" {{ 'selected' if mode == 'exact' }}>精确查询</option>
        <option value="fuzzy" {{ 'selected' if mode == 'fuzzy' }}>模糊查询</option>
        <option value="range" {{ 'selected' if mode == 'range' }}>范围查询</option>
      </select>
    </div>

     <div class="col-sm-3">
      <label class="form-label">字段</label>
      <select name="field" class="form-select">
        <option value="">-- 请选择 --</option>
        <option value="cardID" {{ 'selected' if field == 'cardID' }}>卡号</option>
        <option value="customerID" {{ 'selected' if field == 'customerID' }}>客户编号</option>
        <option value="curID" {{ 'selected' if field == 'curID' }}>类型</option> <!-- 修改 -->
        <option value="openDate" {{ 'selected' if field == 'openDate' }}>开户日期</option>
        <option value="balance" {{ 'selected' if field == 'balance' }}>余额</option>
        <option value="IsReportLoss" {{ 'selected' if field == 'IsReportLoss' }}>是否挂失</option> <!-- 修改 -->
      </select>
    </div>

    <div class="col-sm-4">
      <label class="form-label">查询值</label>
      {% if mode == 'range' %}
      <div class="d-flex gap-2">
        <input type="text" name="low" class="form-control" placeholder="起始值" value="{{ low }}">
        <input type="text" name="high" class="form-control" placeholder="结束值" value="{{ high }}">
      </div>
      {% else %}
      <input type="text" name="value" class="form-control" placeholder="请输入查询值" value="{{ value }}">
      {% endif %}
    </div>

    <div class="col-auto">
      <button type="submit" class="btn btn-gray">查询</button>
      <a href="{{ url_for('cards') }}" class="btn btn-secondary">重置</a>
    </div>
  </form>
</div>

 <!-- 银行卡列表 -->
<div class="card p-4 mt-4">
  <div class="d-flex justify-content-between align-items-center mb-3">
    <div class="d-flex align-items-center" style="font-size: 20px; font-weight: bold;">
      <i class="bi bi-card-list me-2" style="font-size: 24px; color: #3f51b5;"></i>
      银行卡列表
    </div>
    <div>
      <a href="{{ url_for('add_card') }}" class="btn btn-gray me-2">添加银行卡</a>
      <a href="{{ url_for('export_cards') }}" class="btn btn-gray">导出数据</a>
    </div>
  </div>

  <div class="table-responsive">
    <table class="table table-bordered align-middle table-hover">
      <thead class="table-light text-center">
        <tr>
          <th>卡号</th>
          <th>币种</th>
          <th>开卡日期</th>
          <th>开卡金额</th>
          <th>账户余额</th>
          <th>取款密码</th>
          <th>是否挂失</th>
          <th>客户编号</th>
          <th>存款编号</th>
          <th>操作</th>
        </tr>
      </thead>
      <tbody>
        {% for card in cards %}
        <tr class="text-center">
          <td>{{ card.cardID }}</td>
          <td>{{ card.curID }}</td>
          <td>{{ card.openDate }}</td>
          <td>{{ card.openMoney }}</td>
          <td>{{ card.balance }}</td>
          <td>{{ card.pass }}</td>
          <td>{{ '是' if card.IsReportLoss == '是' else '否' }}</td>
          <td>{{ card.customerID }}</td>
          <td>{{ card.savingID }}</td>
          <td>
            <a href="{{ url_for('edit_card', card_id=card.cardID) }}" class="text-primary me-2">编辑</a>
            <a href="{{ url_for('delete_card', card_id=card.cardID) }}" class="text-danger" onclick="return confirm('确定删除该银行卡？')">删除</a>
          </td>
        </tr>
        {% else %}
        <tr>
          <td colspan="10" class="text-center text-muted">暂无数据</td>
        </tr>
        {% endfor %}
      </tbody>

    </table>
  </div>
</div>

</div>
{% endblock %}
